<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@page import="vo.*"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>课程管理</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../layui/css/layui.css">
<script src="../layui/layui.js" charset="utf-8"></script>
<style type="text/css">
.layui-table th {
	font-size: 18px;
}

.layui-table td {
	font-size: 18px;
}
</style>


</head>
<body>
	<table class="layui-hide" id="test" lay-filter="test"></table>

	<script type="text/html" id="barDemo">
     <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
     <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
	</script>

	<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
    <button class="layui-btn layui-btn-sm" lay-event="addCourse">添加课程</button>
  </div>
</script>

<script>
	layui.use('table', function(){
		var table = layui.table;
		table.render({
			elem: '#test'
			,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
			,defaultToolbar: ['filter', 'exports', 'print']
			,title: '课程数据表'
			,cols: [[ //标题栏  课程号、课程名称、学分、职工号
				{field:  'courseno', title: '课程号', width: 130, sort: true }
				,{field: 'coursename', title: '课程名称', width: 160}
				,{field: 'credit', title: '学分', width: 80}
				,{field: 'teano', title: '职工号', width: 180}
				,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:225}
			]]
			,data:${op_course_json}
			,page: true
			//,lay-data:"{initSort:{field:'courseno',type:'desc'}}"
		});
  
		//头工具栏事件
		table.on('toolbar(test)', function(obj){
			var checkStatus = table.checkStatus(obj.config.id);
			switch(obj.event)
			{
			case 'addCourse':
			{  
				layer.open({
					type: 2,
					title:"添加课程",
					offset: 'auto',
					area:['500px','500px'],
					content: '../jsp/op/course_form.jsp?flag=1', //flag=1为添加
					end:function(){
						location.reload();
					}
				}); 
			}
			break;
				//自定义头工具栏右侧图标 - 提示
			case 'LAYTABLE_TIPS':
				layer.alert('这是工具栏右侧自定义的一个图标按钮');
			break;
			};
		});
  
		//监听行工具事件
		table.on('tool(test)', function(obj){
			var data = obj.data;
			//console.log(obj)
			if(obj.event === 'del'){
				layer.confirm('真的删除行么', function(index){
					layer.open({
						type: 2,
						title:"删除",
						offset: 'auto',
						area:['500px','500px'],
						content: '../jsp/op/DeleteCourse.jsp?flag=3&courseno='+data.courseno,//flag=3为删除
						end:function(){
							location.reload();
						}
					}); 
					obj.del();
					layer.close(index);
				});
			} else if(obj.event === 'edit'){
				layer.open({
					type: 2,
					title:"修改",
					offset: 'auto',
					area:['500px','500px'],
					content: '../jsp/op/course_form.jsp?flag=2&courseno='//flag=2为修改
						+data.courseno+
						'&coursename='+data.coursename+
						'&credit='+data.credit+
						'&teano='+data.teano,
					end:function(){
						location.reload();
					}
				});	
			}
		});
});
</script>

</body>
</html>